// 发货单部分详情组件,父类为el-descriptions,注意要用反引号
Vue.component('invoice-part-item-rows', {
    template: `
    <div>
        <el-row class="invoice-item-row">
            <el-col :span="6" class="invoice-item-label">
                <i class="el-icon-user"></i>
                发货单号
            </el-col>
            <el-col :span="18" class="invoice-item-desc">
                {{invoiceDetail.code}}
            </el-col>
        </el-row>
        <el-row class="invoice-item-row">
            <el-col :span="6" class="invoice-item-label">
                <i class="el-icon-mobile-phone"></i>
                工程名称
            </el-col>
            <el-col :span="18" class="invoice-item-desc">
                {{invoiceDetail.conName}}
            </el-col>
        </el-row>
        <el-row class="invoice-item-row">
            <el-col :span="6" class="invoice-item-label">
                <i class="el-icon-tickets"></i>
                客户名称
            </el-col>
            <el-col :span="18" class="invoice-item-desc">
                {{invoiceDetail.clientName}}
            </el-col>
        </el-row>
        <el-row class="invoice-item-row">
            <el-col :span="6" class="invoice-item-label">
                <i class="el-icon-location-outline"></i>
                施工部位
            </el-col>
            <el-col :span="18" class="invoice-item-desc">
                {{invoiceDetail.site}}
            </el-col>
        </el-row>
        <el-row class="invoice-item-row">
            <el-col :span="6" class="invoice-item-label">
                <i class="el-icon-office-building"></i>
                强度等级
            </el-col>
            <el-col :span="18" class="invoice-item-desc">
                {{invoiceDetail.strengthName}}
            </el-col>
        </el-row>
        <el-row class="invoice-item-row">
            <el-col :span="6" class="invoice-item-label">
                <i class="el-icon-office-building"></i>
                特性要求
            </el-col>
            <el-col :span="18" class="invoice-item-desc">
                {{invoiceDetail.tech}}
            </el-col>
        </el-row>
        <el-row class="invoice-item-row">
            <el-col :span="6" class="invoice-item-label">
                <i class="el-icon-truck"></i>
                运输车辆
            </el-col>
            <el-col :span="18" class="invoice-item-desc">
                {{invoiceDetail.carCode}}
            </el-col>
        </el-row>
        <el-row class="invoice-item-row">
            <el-col :span="6" class="invoice-item-label">
                <i class="el-icon-office-building"></i>
                生产方量:
            </el-col>
            <el-col :span="18" class="invoice-item-desc">
                {{invoiceDetail.proStere}},
                <el-tag v-if="invoiceDetail.invoiceType == 0" size="minie">
                    {{invoiceDetail.invoiceTypeTxt}}
                </el-tag>
                <el-tag v-else-if="invoiceDetail.invoiceType == 1" type="warning" size="minie">
                    {{invoiceDetail.invoiceTypeTxt}}
                </el-tag>
                <el-tag v-else type="info" size="minie">
                    {{invoiceDetail.invoiceTypeTxt}}
                </el-tag>
            </el-col>
        </el-row>
        <!--<el-row class="invoice-item-row">
            <el-col :span="6" class="invoice-item-label">
                <i class="el-icon-odometer"></i>
                派单时间
            </el-col>
            <el-col :span="18" class="invoice-item-desc">
                {{invoiceDetail.createTime}}
            </el-col>
        </el-row>-->
    </div>
      `,
    props: {
        invoiceDetail: {
            type: Object,
            //  当参数是对象时,需要默认数据
            default: function () {
                let inv = {
                    id: null,
                    code: "",
                };
                return inv;
            }
        },
    },
    data() {
        return {};
    },
    created() {
        let that = this;
    },
    methods: {}
});

// 创建 Vue 实例
new Vue({
    el: '#app',
    data() {
        return {};
    }
});
